<template>
	<view>
		<u-sticky><u-tabs :list="list" :is-scroll="false" :current="current" @change="sectionChange"></u-tabs></u-sticky>
		<u-card padding="16" v-for="(item,index) in dataList" :key="index" v-if="current == 0">
			<view class="" slot="head">
				<view class="wrap">
					<u-row>
						<u-col span="5" text-align="left">
							<view class="weikaishi2">
								<span>{{item.areaName}}</span>
							</view>
						</u-col>
						<u-col span="7" text-align="right">
							<view class="weikaishi3 jinxingzhong">
								<span>盘点人：{{item.userName}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6" text-align="left">
							<view class="weikaishi4">
								<span>开盘总库存：{{item.countNum}}</span>
							</view>
						</u-col>
						<u-col span="6" text-align="right">
							<view class="weikaishi4">
								<span>开盘总体积：{{item.countVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6" text-align="left">
							<view class="weikaishi4">
								<span>已盘数量：{{item.alreadyNum}}</span>
							</view>
						</u-col>
						<u-col span="6" text-align="right">
							<view class="weikaishi4">
								<span>已盘体积：{{item.alreadyVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6" text-align="left">
							<view class="weikaishi4">
								<span>实盘数量：{{item.trueNum}}</span>
							</view>
						</u-col>
						<u-col span="6" text-align="right">
							<view class="weikaishi4">
								<span>实盘体积：{{item.trueVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="12" text-align="right">
							<view class="u-line-1 weikaishi2 lanse">
								<span v-html="item.speed+'%'"></span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="12" text-align="center">
							<view class="u-line-1">
								<u-line-progress :striped="true" :percent="item.speed" :striped-active="true"></u-line-progress>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
			<view class="" slot="body">
				<view class="wrap">
					<u-row v-for="(item1,index1) in item.list" :key="index1">
						<u-col span="12" text-align="left">
							<view class="weikaishi4 u-m-t-4 u-m-t-10">
								<span>库位：{{item1.positionNumber}}</span>
							</view>
						</u-col>
						<u-col span="12">
							<view class="weikaishi6 u-m-t-4">
								<span>数量：{{item1.num}} 体积：{{item1.volume}} 托数：{{item1.trayNum}}托 品类：{{item1.goodsNum}}个</span>
							</view>
						</u-col>
						<u-col span="12" text-align="right">
							<view class="">
								<span><u-button type="default" plain="true" size="default" @click="toposition(item1.positionId)">盘点</u-button></span>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
		</u-card>
		<u-card padding="16" v-for="(item,index) in yidataList" :key="index" v-if="current == 1">
			<view class="" slot="head">
				<view class="wrap">
					<u-row>
						<u-col span="5" text-align="left">
							<view class="weikaishi2">
								<span>{{item.areaName}}</span>
							</view>
						</u-col>
						<u-col span="7" text-align="right">
							<view class="weikaishi3 jinxingzhong">
								<span>盘点人：{{item.userName}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6" text-align="left">
							<view class="weikaishi4">
								<span>开盘总库存：{{item.countNum}}</span>
							</view>
						</u-col>
						<u-col span="6" text-align="right">
							<view class="weikaishi4">
								<span>开盘总体积：{{item.countVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6" text-align="left">
							<view class="weikaishi4">
								<span>已盘数量：{{item.alreadyNum}}</span>
							</view>
						</u-col>
						<u-col span="6" text-align="right">
							<view class="weikaishi4">
								<span>已盘体积：{{item.alreadyVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="6" text-align="left">
							<view class="weikaishi4">
								<span>实盘数量：{{item.trueNum}}</span>
							</view>
						</u-col>
						<u-col span="6" text-align="right">
							<view class="weikaishi4">
								<span>实盘体积：{{item.trueVolume}}</span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="12" text-align="right">
							<view class="u-line-1 weikaishi2 lanse">
								<span v-html="item.speed+'%'"></span>
							</view>
						</u-col>
					</u-row>
					<u-row>
						<u-col span="12" text-align="center">
							<view class="u-line-1">
								<u-line-progress :striped="true" :percent="item.speed" :striped-active="true"></u-line-progress>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
			<view class="" slot="body">
				<view class="wrap">
					<u-row v-for="(item1,index1) in item.list2" :key="index1">
						<u-col span="12" text-align="left">
							<view class="weikaishi4 u-m-t-4 u-m-t-10">
								<span>库位：{{item1.positionNumber}}</span>
							</view>
						</u-col>
						<u-col span="12">
							<view class="weikaishi6 u-m-t-4">
								<span>数量：{{item1.num}} 体积：{{item1.volume}} 托数：{{item1.trayNum}}托 品类：{{item1.goodsNum}}个</span>
							</view>
						</u-col>
						<u-col span="12">
							<view class="weikaishi6 u-m-t-4">
								<span>盘点数量：{{item1.trueNum}} 盘点体积：{{item1.trueVolume}}</span>
							</view>
						</u-col>
						<u-col span="12" text-align="right">
							<view class="">
								<span><u-button type="default" plain="true" size="default" @click="toposition(item1.positionId)">盘点明细</u-button></span>
							</view>
						</u-col>
					</u-row>
				</view>
			</view>
		</u-card>
		<view>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [
					{
						name: '待盘列表'
					}, 
					{
						name: '已盘列表'
					},
				],
				current: 0,
				dataList:[],
				yidataList:[],
				diskId:'',
			};
		},
		onLoad(open) {
			this.diskId = open.diskId
		},
		onShow() {
			setTimeout(() => {
				this.refresh()
			}, 200)
		},
		onPullDownRefresh() {
			this.refresh()
			uni.stopPullDownRefresh()
		},
		methods: {
			toposition(positionId){
				this.$Router.push({ 
					name: 'pandiantask',
					params: {
						diskId:this.diskId,
						positionId:positionId
					},
				})
			},
			refresh(){
				uni.showLoading({
					title: '加载中'
				})
				if(this.current == 0){
					this.$http.post('/rest/PanDian/staylist',{
					},{
						params: {
							diskId: this.diskId
						},
						header: {
							'Authorization' :uni.getStorageSync('token'),
						}
					}).then(res => {
						this.dataList = res.data.data
					})
				} else if (this.current == 1){
					this.$http.post('/rest/PanDian/yistaylist',{
					},{
						params: {
							diskId: this.diskId
						},
						header: {
							'Authorization' :uni.getStorageSync('token'),
						}
					}).then(res => {
						this.yidataList = res.data.data
					})
				}
				uni.hideLoading()
			},
			sectionChange(e){
				this.current = e
				this.refresh()
			},
		}
	};
</script>
<style lang="scss">
	
	.u-body-item {
		padding: 20rpx 15rpx;
	}
	.wrap {
		padding: 10rpx;
	}

	.u-row {
		margin: 10rpx 2rpx;
	}
</style>